<template>
	<view>
		
		<view style="margin:50rpx auto;display: flex; flex-direction: column; justify-content: center; flex: 1; align-items: center;">
			<text class="title">{{setting.site_name}}</text>
			<text class="description">{{setting.app_version}}</text>
		</view>
		
		<view class="form">
			<view class="form-item u-border-bottom">
				<text class="form-title">关注微信</text>
				<text class="form-content">{{setting.wechat_name}}</text>
			</view>
			<view class="form-item u-border-bottom">
				<text class="form-title">关注微博</text>
				<text class="form-content">{{setting.weibo}}</text>
			</view>
			<view class="form-item u-border-bottom">
				<text class="form-title">使用说明</text>
				<text class="form-content" @click="toContent">查看</text>
			</view>
			<view class="form-item u-border-bottom">
				<text class="form-title">意见反馈</text>
				<text class="form-content">{{setting.fankui}}</text>
			</view>
			<view class="form-item u-border-bottom">
				<text class="form-title">商务合作</text>
				<text class="form-content">{{setting.hezuo}}</text>
			</view>
			<view class="form-item u-border-bottom">
				<text class="form-title">手机号码</text>
				<text class="form-content">{{setting.mobile}}</text>
			</view>
		</view>
		
	</view>
</template>
<style>
	page{
		background-color: #FFFFFF;
	}
	.title{
		font-size: 48rpx;
	}
	.description{
		font-size: 28rpx; color: #666666; margin-top: 24rpx;
	}
	.form{ display: flex; flex-direction: column; margin-top: 16rpx; } 
	.form-item{ display: flex; flex-direction: row; justify-content: space-between; align-items: center; margin:0 32rpx; background-color: #FFFFFF; }
	.form-title{ font-size: 24rpx; line-height: 110rpx; margin-right: 30rpx;}
	
	.form-content{
		font-size: 24rpx;
		color: #666666;
	}
</style>

<script>
	export default {
		data() {
			return {
				inputStyle:{
					height:'110rpx',
					fontSize:'24rpx',
					flex:'1',
					width:'100%'
				},
				avatar:"",
				userinfo:{
					user_nickname:"",
					mobile:"",
					user_email:"",
					user_login:"",
					cardid:"",
					cardname:"",
					cardopen:""
				},
				department:{},
				company:{},
				setting:{}
				
			}
		},
		created() {
			// 监听从裁剪页发布的事件，获得裁剪结果
			uni.$on('uAvatarCropper', path => {
				this.$u.api.uploadFile({
					url:'user/upload/one?app=user',
					filePath: path,
					name: 'file',
					success: (res) => {
						this.$u.api.postUserInfo({avatar:res.data.url}).then(result => {
							this.$u.toast(result.msg);
							if(result.code){
								this.avatar = res.data.url;
								uni.setStorageSync('user',res.data);
							}
						});
					}
				})
			})
		},
		onLoad(){
			this.getDatas();
			if(!uni.getStorageSync('login')){
				uni.navigateTo({
					url:"/pages/user/login"
				})
			}
			
			this.$u.http.get("/user/setting/setting").then(res => {
				this.setting = res.data.setting;
			})
			
		},
		methods: {
			
			toContent(){
				uni.navigateTo({
					url:"/pages/user/abouts"
				})
			},
			
			getDatas(){
				
				//用户信息
				this.$u.api.getUserInfo().then(res => {
					this.userinfo = res.data;
					this.avatar = res.data.avatar;
				});
				
				
			},
			
			
			chooseAvatar() {
				console.log(123);
				this.$u.route({
					url: '/uview-ui/components/u-avatar-cropper/u-avatar-cropper',
					params: {
						// 输出图片宽度，高等于宽，单位px
						destWidth: 300,
						// 裁剪框宽度，高等于宽，单位px
						rectWidth: 200,
						// 输出的图片类型，如果'png'类型发现裁剪的图片太大，改成"jpg"即可
						fileType: 'jpg',
					}
				})
			},
			
			sex(e){
				this.userinfo.sex = e.detail.value;
			},
			birthday(e){
				this.userinfo.birthday = e.detail.value;
			},
			submit:function(e){
				
				this.$u.api.postUserInfo({
					user_login:this.userinfo.user_login,
					mobile:this.userinfo.mobile
				}).then(res => {
					this.$u.toast(res.msg);
					if(res.code){
						uni.setStorageSync('user',res.data);
					}
				});
				
			},
		}
	}
</script>

<style>

</style>
